import 'package:flutter/material.dart';
import 'package:wayofdressing/contraints.dart';
import 'package:wayofdressing/screens/my_showcase.dart';
import 'package:wayofdressing/screens/market_screen.dart';
import 'package:wayofdressing/components/inmenubutton.dart';

class StoreScreen extends StatefulWidget {
  static final String id = 'storescreen';

  @override
  State<StoreScreen> createState() => _StoreScreenState();
}

class _StoreScreenState extends State<StoreScreen> {
  final TextEditingController textControll = TextEditingController();

  @override
  void dispose() {
    textControll.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xfffffaf0),
      appBar: AppBar(
        backgroundColor: Color(0xfffffaf0),
        elevation: 0,
        toolbarHeight: 80,
        leadingWidth: 100,
        centerTitle: true,
        title: Text(
          '卖场',
          style: TextStyle(
            color: Colors.black,
            fontWeight: FontWeight.bold,
            fontSize: kTopTitleFontSize,
          ),
        ),
        leading: Row(
          children: [
            SizedBox(
              width: 10,
            ),
            GestureDetector(
              onTap: () {
                Navigator.pop(context);
              },
              child: Transform.scale(
                scaleX: -1,
                child: Icon(
                  Icons.play_arrow_rounded,
                  size: kAppBarButtonSize,
                  color: Colors.black.withOpacity(0.5),
                ),
              ),
            ),
          ],
        ),
        actions: [
          MenuAnchor(
            menuChildren: [
              InMenuButton(
                onPressed: () {},
                text: '待开发',
                alignment: Alignment.centerRight,
              ),
            ],
            style: MenuStyle(
              shape: MaterialStateProperty.all(
                RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(25.0),
                ),
              ),
              alignment: Alignment(-3, 0.5),
              padding: MaterialStateProperty.all(EdgeInsets.all(15.0)),
              shadowColor: MaterialStateProperty.all(Colors.transparent),
              backgroundColor: MaterialStateProperty.all(
                Colors.black.withOpacity(0.4),
              ),
            ),
            builder: (BuildContext context, MenuController controller,
                Widget? child) {
              return GestureDetector(
                onTap: () {
                  if (controller.isOpen) {
                    controller.close();
                  } else {
                    controller.open();
                  }
                },
                child: Icon(
                  Icons.keyboard_control_rounded,
                  size: kAppBarButtonSize,
                  color: Colors.black,
                ),
              );
            },
          ),
          SizedBox(
            width: 20,
          )
        ],
      ),
      body: Stack(
        alignment: Alignment.center,
        children: [
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Expanded(
                flex: 2,
                child: GestureDetector(
                  onTap: () {
                    Navigator.pushNamed(context, MyShowcase.id);
                  },
                  child: Container(
                    margin: EdgeInsets.symmetric(horizontal: 30.0,vertical: 5),
                    padding: EdgeInsets.all(10.0),
                    decoration: BoxDecoration(
                      boxShadow: [
                        BoxShadow(
                          color: Colors.black.withOpacity(0.2),
                          // 阴影颜色和透明度
                          spreadRadius: 2,
                          // 阴影扩展半径
                          blurRadius: 5,
                          // 阴影模糊半径
                          offset: Offset(0, 2), // 阴影偏移量
                        ),
                      ],
                      borderRadius: BorderRadius.circular(25.0),
                      color: Colors.white,
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          flex: 2,
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                mainAxisAlignment: MainAxisAlignment.start,
                                children: [
                                  Icon(
                                    Icons.money_rounded,
                                    size: 70,
                                  )
                                ],
                              ),
                              Text(
                                '5件商品在售',
                                style: TextStyle(
                                    color: Colors.blueAccent, fontSize: 12),
                              )
                            ],
                          ),
                        ),
                        Expanded(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.end,
                            children: [
                              Text(
                                '我的橱窗',
                                style: TextStyle(
                                  fontWeight: FontWeight.bold,
                                  fontSize: 18.0,
                                ),
                              ),
                            ],
                          ),
                        )
                      ],
                    ),
                  ),
                ),
              ),
              SizedBox(
                height: 20,
              ),
              Expanded(
                flex: 4,
                child: GestureDetector(
                  onTap: () => Navigator.pushNamed(context, MarketScreen.id),
                  child: Container(
                    margin: EdgeInsets.symmetric(horizontal: 30.0),
                    padding: EdgeInsets.all(10.0),
                    decoration: BoxDecoration(
                      boxShadow: [
                        BoxShadow(
                          color: Colors.black.withOpacity(0.2),
                          // 阴影颜色和透明度
                          spreadRadius: 2,
                          // 阴影扩展半径
                          blurRadius: 5,
                          // 阴影模糊半径
                          offset: Offset(0, 2), // 阴影偏移量
                        ),
                      ],
                      borderRadius: BorderRadius.circular(25.0),
                      color: Colors.white,
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.end,
                      children: [
                        Row(
                          children: [
                            Icon(
                              Icons.store_rounded,
                              size: 70,
                            )
                          ],
                        ),
                        Text(
                          '市集',
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            fontSize: 18.0,
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
              SizedBox(height: 10,),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  Column(
                    children: [
                      Icon(
                        Icons.inventory_rounded,
                        size: 45,
                      ),
                      Text('订单')
                    ],
                  ),
                  Column(
                    children: [
                      Icon(
                        Icons.shopping_cart_outlined,
                        size: 45,
                      ),
                      Text('想买')
                    ],
                  ),
                  Column(
                    children: [
                      Icon(
                        Icons.history_rounded,
                        size: 45,
                      ),
                      Text('逛过')
                    ],
                  ),
                  Column(
                    children: [
                      Icon(
                        Icons.favorite_border_rounded,
                        size: 45,
                      ),
                      Text('关注')
                    ],
                  ),
                ],
              ),
              SizedBox(
                height: 80,
              ),
            ],
          ),
          Positioned(
            bottom: -10,
            child: Container(
              height: 50,
              width: 240,
              margin: EdgeInsets.symmetric(horizontal: 50, vertical: 30),
              decoration: BoxDecoration(
                color: Colors.black.withOpacity(0.3),
                borderRadius: BorderRadius.circular(40.0),
              ),
              child: TextField(
                controller: textControll,
                showCursor: false,
                textAlign: TextAlign.center,
                cursorColor: Colors.black,
                style: TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                  fontSize: 22,
                ),
                decoration: InputDecoration(
                  suffixIcon: GestureDetector(
                    onTap: () {
                      setState(() {
                        textControll.clear();
                      });
                    },
                    child: Icon(
                      Icons.search_rounded,
                      size: 50,
                      color: Colors.white,
                    ),
                  ),
                  border: InputBorder.none,
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
